// 创建一个路由器，并暴露出去

// 第一步：导入 createRouter 方法
import { createRouter, createWebHistory } from 'vue-router'

import Home from '@/pages/Home.vue'
import About from '@/pages/About.vue'
import News from '@/pages/News.vue'

// 第二步：创建路由器
const router = createRouter({
  history: createWebHistory(), // 路由器的工作模式，vue3要有
  routes: [
    {
      path: '/home',
      component: Home
    },
    {
      path: '/news',
      component: News
    },
    {
      path: '/about',
      component: About
    }
  ]
})

export default router

/**
 * history模式：
 *      vue2: mode: 'history'
 *      vue3: history: createWebHistory()
 *      react: BrowserRouter
 * 优点：URL 更加美观，不带有#，更接近传统的网站URL。
 * 缺点：后期项目上线，需要服务端配合处理路径问题，否则刷新会有404错误。
 * 
 * 
 * 
 * hash模式：
 * 优点：兼容性好，因为不需要服务器端处理路径。
 * 缺点：URL嗲有#不太美观，且在SEO优化方面相对较差。
 * 
 */